
var next = 1;
var nextRank = 0;
var perPage = 30;

var jumpTo = null;

var perScore = 0;

var rankMap = [-1];
var rankNickMap = ["head"];

var firstLoad = true;

/*
function autoAppend() {
	var dvhm = document.getElementById("divHallMain");
    var scrollTop    = dvhm.scrollTop;
    var windowHeight = dvhm.clientHeight;
    var scrollHeight = dvhm.scrollHeight;
    if (scrollTop + windowHeight > scrollHeight * 0.95) {
        appendContentPage();
    }
}
*/
function appendContentPage() {
	for(i = 0; i < perPage; ++i) {
		addRankItem(i, "xxx", null, i, next++);
	}
}

function hideBtnPageGo() {
	//$("#btnPageGo").css("display", "none");
	let btn = $("#btnPageGo");
	btn[0].onclick = refresh;
	btn.css("border-radius", "6vh 0.5vh 6vh 0.5vh");
	btn.css("justify-content", "center");
	btn.css("padding-right", "0");
	btn.text("返回");
	$("#rankBox").css("display", "none");
}

function autoAppend() {
	var dvhm = document.getElementById("divHallMain");
    var scrollTop    = dvhm.scrollTop;
    var windowHeight = dvhm.clientHeight;
    var scrollHeight = dvhm.scrollHeight;
    if (scrollTop + windowHeight > scrollHeight * 0.95) {
		load(next, next + perPage);
    }
}

function searchPlayer() {
	let playerNick = document.getElementById("searchBox").value;
	if(playerNick == null || playerNick == "") return;
	
	$.ajax({
		url:"searchRank.user",
		type:"post",
		data:{
			nick:playerNick
		},
		dataType:"json",
		success:function(data) {
			//console.log(data);

			$(".rnkItem").remove();
			next = 1;
			nextRank = 0;
			
			jumpTo = null;
			
			perScore = 0;
			
			rankMap = [-1];
			rankNickMap = ["head"];
			
			for(pair of data.rankPairList) {
				addRankItem(
					pair.user.id, pair.user.nick, pair.user.headPic, 
					pair.user.score, next++, pair.rank
				);
			}
			hideBtnPageGo();
		}
	});
}

function locateRank() {
	if(next == 1) return;

	var rank;
	if(jumpTo != null) {
		rank = jumpTo;
		jumpTo = null;
	} else {
		rank = document.getElementById("rankBox").value;
		rank = rankMap[rank];
		if(rank == null || rank < 1) return;
	}
	
	if(rank == null || rank == "") return;
	
	if(next <= rank) {
		jumpTo = rank;
		load(next, rank);
		return;
	}
		
	var perHeight = document.getElementById("rnk_1").offsetHeight;
	var boxHeight = document.getElementById("divHallMain").clientHeight;

	var countPerPage = boxHeight / perHeight;
	
	var targetPage = (rank - 1) / countPerPage;
	divHallMain.scrollTop = targetPage * boxHeight;
}

$(document).ready(function() {
	document.getElementById("divHallMain").onscroll = autoAppend;
    load(next, perPage);
	document.getElementById("btnPageGo").onclick = locateRank;
	document.getElementById("btnSearchGo").onclick = searchPlayer;
});

function load(lower, higher) {
	$.ajax({
		url:"getRankList.user",
		type:"post",
		data:{
			low:lower,
			high:higher
		},
		dataType:"json",
		success:function(data) {
			let loaded = 0;
			for(user of data.rankList) {
				if(user.score != perScore) {
					++nextRank;
					rankMap.push(next);
				}
				addRankItem(user.id, user.nick, user.headPic, user.score, next, nextRank);
				++next;
				perScore = user.score;
				++loaded;
			}

			//判断加载完毕
			if(jumpTo == null && loaded < perPage  ||  jumpTo != null && loaded < 1) {
				document.getElementById("divHallMain").onscroll = null;	
				jumpTo = next - 1;
			}
			
			if(jumpTo != null) locateRank();
			if(firstLoad == true) {
				firstLoad = false;
				divHallMain.scrollTop = 0;
			}
		}
	});
}

function addRankItem(uid, unick, uhead, uscore, rank, compRank) {

    let rankPostfix;

	switch(compRank) {
		case 1:  rankPostfix = "st"; break;
		case 2:  rankPostfix = "nd"; break;
		case 3:  rankPostfix = "rd"; break;
		default: rankPostfix = "th";
	}
    
    $("#divHallMain").append(
        "<div id=\"rnk_" + rank + "\" class=\"rnkItem\">" + 
            "<div id=\"rnk_"+ rank +"_hostHeadPic\" class=\"headPic Unlock\"></div>" + 
            "<div class=\"rnkItem_info\">" + 
                "<label class=\"lblNick\">" + unick + "</label>" + 
                "<label class=\"lbluid\">uid:" + uid + " - " + uscore + "分</label>" +
            "</div>" + 
            "<div id=\"rnk_" + rank + "_rank\" class=\"rankNumber\">" + compRank + rankPostfix + "</div>" +
        "</div>"
    );

	if(uhead != null) $("#rnk_" + rank + "_hostHeadPic").css("background-image", headPicPathname(uhead));
}
